<template>
  <div>
    <h1>App</h1>
    lastName: {{ lastName }}
    <hr>
    firstName:{{ firstName }}
  </div>
</template>
<script setup>
import { computed, reactive, ref, shallowReactive, shallowRef, toRef, toRefs, watch } from 'vue';

const lastName = ref('jack');
const firstName = ref('li');

watch([firstName, lastName], ([a1, b1], [a2, b2]) => {
  console.log(a1, b1);
  console.log(a2, b2);
})

// watch([firstName, lastName], (newValue, oldValue) => {
//   console.log(newValue, oldValue);
// })

// watch(firstName, (newValue, oldValue) => {
//   console.log(newValue, oldValue);
// });

// watch(lastName, (newValue, oldValue) => {
//   console.log(newValue, oldValue);
// });




</script>
